<template>
  <view class="service-card">
    <text class="service-title">我的服务</text>
    <view class="service-list">
      <view @click="navto(item.url,item)" class="service-item" v-for="(item, idx) in menus" :key="idx">
        <u-image :src="item.img" width="100rpx" height="100rpx"></u-image>
        <text>{{ item.text }}</text>
      </view>
    </view>
  </view>
</template>

<script>
import {
  mapState,
  mapMutations,
  mapActions
} from 'vuex'
export default {
  name: 'CardMenus',
  props: {
    menus: {
      type: Array,
      default: () => []
    }
  },
  computed: {
    ...mapState("community",[
      "communityId"
    ])
  },
  methods: {
    ...mapActions("app",["isLogin"]),
    async navto(url,row){  
    
      if(row.text=="我的房屋"){
         console.log("row",row,this.communityId)
       if(!this.communityId||this.communityId==-1){
        console.log("row1",row)
        uni.$u.toast("请先选择小区")
        return
       }
      }
      
      if(!url){
        uni.$u.toast("暂未开放")
        return
      } 
     let bo=await this.isLogin()
   
     if(bo){
      uni.navigateTo({
        url: url+"?communityId="+this.communityId
      })
     }else{
    
     }
    }
  }
}
</script>

<style lang="scss" scoped>

.service-title {
  font-size: 36rpx;
  font-weight: bold;
  margin-bottom: 30rpx;
  display: block;
}
.service-list {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.service-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text {
    font-weight: 400;
    font-size: 26rpx;
    color: #323233;
    margin-top: 22rpx;
  }
}
</style>
